<template>
  <view class="main">
    <topCommonTitleBar
      :statePerchHeight="'var(--status-bar-height)'"
      class="tapBar"
      :statePerch="true"
      backgroundColor="#fff"
      arrow="black"
      dot-color="#666"
      :show-dot="false"
    >
    </topCommonTitleBar>
    <view class="content" v-if="details">
      <view class="title">{{ details.name }}</view>
      <view class="content_info">
        <view class="info_txt">发文字号：{{ details.push_number }}</view>
        <view class="info_txt">发文机关：{{ details.push_department }}</view>
        <view class="info_txt">发文日期：{{ details.push_date }}</view>
        <view class="info_txt">效力注释：{{ details.active_info }}</view>
      </view>
      <scroll-view style="height: calc(100vh - 556rpx)" :scroll-y="true">
        <view class="tips" v-if="details && details.notice">
          <view class="tips_title">提示:</view>
          <view class="tips_txt">{{ details.notice }}</view>
        </view>
        <u-parse
          :lazyLoad="true"
          :content="details.info_content"
          class="content_txt"
          :style="{ fontSize: fontSize }"
        ></u-parse>
      </scroll-view>
    </view>
  </view>
</template>

<script
  type="text/javascript"
  src="plus-confusion://../law/acct/det/index"
></script>

<style lang="scss">
.main {
  background: #ffffff;

  .tapBar {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
  }

  .content {
    padding: 0 35rpx 0 35rpx;

    .title {
      font-weight: 700;
      color: #333333;
      line-height: 55rpx;
      font-size: 40rpx;
    }

    .content_info {
      margin: 50rpx 0 40rpx 0;
      width: 100%;
      padding: 20rpx 30rpx;
      box-sizing: border-box;
      background: #f2f8ff;
      border-radius: 17rpx;

      .info_txt {
        margin-bottom: 15rpx;
        font-size: 26rpx;
        color: #3a6bb3;
        line-height: 38rpx;

        &:last-child {
          margin-bottom: 0;
        }
      }
    }

    .content_txt {
      font-size: 28rpx;
      color: #333333;
      line-height: 55rpx;
      letter-spacing: 2rpx;
      white-space: pre-line;
      text-indent: 2em;
    }
  }
}

.tips {
  margin-bottom: 20rpx;
  width: 100%;
  padding: 20rpx 30rpx;
  box-sizing: border-box;
  background: #fffbf6;
  border-radius: 17rpx;
  .tips_title {
    font-size: 28rpx;
    color: #4f3f2b;
    font-weight: 700;
    margin-bottom: 20rpx;
  }

  .tips_txt {
    font-size: 26rpx;
    color: #4f3f2b;
    line-height: 38rpx;
    letter-spacing: 2rpx;
  }
}
</style>
